<template>
<div>
  <el-breadcrumb
    separator-class="el-icon-arrow-left"
    style="margin-right: 30px;position:absolute;right:0;ub main-center cross-center"
  >
    <el-breadcrumb-item :to="{ path: '/' }">二级分类管理</el-breadcrumb-item>
    <el-breadcrumb-item>商品管理</el-breadcrumb-item>

    <el-breadcrumb-item>配送中心</el-breadcrumb-item>
  </el-breadcrumb>

<el-button type="text" @click="dialogFormVisible = true">打开嵌套表单的 Dialog</el-button>

<el-dialog title="收货地址" width="80%" :visible.sync="dialogFormVisible">
  
      <div class="b">
      <span>手环人名称</span>
      <el-input style="width:40%;border-left:3px solid white;border-right:2px solid black;" v-model="form.name" auto-complete="off"></el-input>
       <span>账号名称</span>
      <el-input style="width:40%;border-right:2px solid black;" v-model="form.name" auto-complete="off"></el-input>
      </div><br>
  
      <div class="c">
         <span>手环人名称</span>
      <el-input style="width:10%;border-right:2px solid black;" v-model="form.name" auto-complete="off"></el-input>
       <span>手环人名称</span>
      <el-input style="width:10%;border-right:2px solid black;" v-model="form.name" auto-complete="off"></el-input>
      <span>手环人名称</span>
      <el-input style="width:10%;border-right:2px solid black;" v-model="form.name" auto-complete="off"></el-input>
       <span>手环人名称</span>
      <el-input style="width:10%;border-right:2px solid black;" v-model="form.name" auto-complete="off"></el-input>
      <span>手环人名称</span>
      <el-input style="width:10%;border-right:2px solid black;" v-model="form.name" auto-complete="off"></el-input>
      </div><br>

      <div class="d">
      <el-input style="width:20%;border-right:2px solid black;" v-model="form.name" auto-complete="off"></el-input>
      <el-input style="width:20%;border-right:2px solid black;" v-model="form.name" auto-complete="off"></el-input>
      <el-input style="width:20%;border-right:2px solid black;" v-model="form.name" auto-complete="off"></el-input>
      <el-input style="width:20%;border-right:2px solid black;" v-model="form.name" auto-complete="off"></el-input>
      <el-input style="width:20%;border-right:2px solid black;" v-model="form.name" auto-complete="off"></el-input>
      </div><br>
 
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogFormVisible = false">取 消</el-button>
    <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
  </div>
</el-dialog>

  
</div>
</template>

<script>
export default {
  data(){
    return{
      
        dialogTableVisible: false,
        dialogFormVisible: false,
        form: {
          name: '',
          region: '',
          date1: '',
          date2: '',
          delivery: false,
          type: [],
          resource: '',
          desc: ''
        },
        formLabelWidth: '120px'
    }
  },
  
methods: { 
  
}
};
</script>


<style scoped>
.b{

  
  /* height: 50px; */
  border: 1px solid black;
  }
  .c{

  border: 1px solid black;
  }
  .d{

  border: 1px solid black;
  }
  input{background-color: white;}
</style>